<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" session="false" %>
<%
	String path = request.getContextPath();
	pageContext.setAttribute("path", path);
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>用户管理</title>
<link rel="stylesheet" type="text/css" href="${path}/script/extjs-3.2.1/resources/css/ext-all.css" />
<script type="text/javascript" src="${path}/script/extjs-3.2.1/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="${path}/script/extjs-3.2.1/ext-all.js"></script>
<script type="text/javascript" src="${path}/resources/js/manage1.js"></script>
</head>
<body>
<div id="page"></div>
<script type="text/javascript">
// 回填
// 数值型回填日期
// 查询
// 修改baseParams
// load的话还是写下参数，reload所有分页baseParams参数+分页参数
// 删除
// 空了回到上一页怎么做？

Ext.onReady(function(){

	var menu = new Ext.menu.Menu({
		items: [{text: "新建"}, {text: "删除", handler: function(){
			// 获得当前选中的节点?
		}}]
	});

	var tree0 = new Ext.tree.TreePanel({
		enableDD: true,
	    containerScroll: true,
	    border: false,
	    loader: new Ext.tree.TreeLoader({
	    	url: "${path}/data/treedata.do",
			baseParams: {parentId: null},
			listeners: {
				beforeload: function(loader, node){
					loader.baseParams.parentId = node.id;
				}
			}
	    }),
		root: new Ext.tree.AsyncTreeNode({
	    	text: "阶段",
	    	expanded: true
		}),
		listeners: {
			contextmenu: function(node, e){
				menu.showAt(e.getXY());
			}
		}
	});

	var tree1 = new Ext.tree.TreePanel({
		enableDD: false,
	    containerScroll: true,
	    border: false,
	    loader: new Ext.tree.TreeLoader(),
	    root: new Ext.tree.AsyncTreeNode({
	    	text: "多媒体",
	        expanded: true,
	        children: [{
	        	id: "videoNode",
	            text: '视频',
	            leaf: true
	        }, {
	        	id: "imageNode",
	            text: '图片',
	            leaf: true
	        }]
	    }),
	    listeners: {
	        click: function(node, e) {
	        	// attributes 自定义属性
				if(node.attributes.id == "videoNode"){
					var ep = new sh.extjs.module.EmployeePanel({
						height: 400,
						closable: true,
						border: false,
						getUrl: "${path}/example/get.do",
						queryUrl: "${path}/example/page.do",
						editUrl: "${path}/example/edit.do",
						removeUrl: "${path}/example/remove.do"
					});
					var main = Ext.getCmp("main");
					// 先清空
					if(main.items.getCount() > 0)
						main.remove(0);
					main.add(ep);
					main.doLayout();
				}else if(node.attributes.id == "imageNode"){

				}
	        }
	    }
	});

	new Ext.Viewport({
		layout: "border",
		items: [
			{region: "north", id: "top", border: false, height: 20, bbar: [{height: 20, border: false}]},
			{region: "west", id: "menu", title: "菜单", width: 200, margins: '0, 5, 0, 5', collapsible: true, items: [
				tree0, tree1
			]},
			{region: "center", id: "main", xtype: "tabpanel", enableTabScroll: true, tabPosition: "top", closable: true}
		]
	});


});
</script>
</body>
</html>
